import React, { ReactElement, useContext, useEffect, useMemo } from 'react';
import { View } from 'react-native';
import { playSoundWithUrl } from '../../../../util/sound';

import { getProblemIsAllWrong, onEndSoundPlayer } from '../../actions';
import { Store } from '../../reducer';
import { deleteAudio } from '../../util/spliceAudio';

export default (): ReactElement => {
  const { state } = useContext(Store);
  const { soundUrl, showSignSuccess, showProblemResult } = state;
  const allWrong = getProblemIsAllWrong();

  useEffect((): void => {
    if (showSignSuccess || (showProblemResult && !allWrong)) {
      playSoundWithUrl({
        url:
          'https://yte-resource-audio.oss-cn-hangzhou.aliyuncs.com/gold/getCoin.mp3'
      });
    }
  }, [allWrong, showProblemResult, showSignSuccess]);

  useEffect((): void => {
    if (!soundUrl) return;
    const { url, audioFilePath } = soundUrl;
    playSoundWithUrl({
      url,
      playEnd: (): void => {
        onEndSoundPlayer();
        if (audioFilePath) {
          deleteAudio(audioFilePath);
        }
      }
    });
  }, [soundUrl]);

  return useMemo((): ReactElement => {
    return <View />;
  }, []);
};
